<template>
    <div>
        <h1>2---小说添加页面</h1>
        <p>小说名称：<input type="text" v-model="name"></p>
        <p>小说作者：<select v-model="user">
                <option :value="user.id" v-for="(user,index) in user_li" :key="index">{{user.name}}</option>
            </select></p>
        <p>小说简介：<input type="text" v-model="details"></p>
        <p>小说图片：<input type="file" id="img"></p>
        <p><button @click="xiaoshuo">添加</button></p>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            name:'',
            user:'',
            user_li:[],
            details:'',

        }
    },
    methods: {
        xiaoshuo(){
            let fdata = new FormData()
            fdata.append('name',this.name)
            fdata.append('user',this.user)
            fdata.append('details',this.details)
            fdata.append('img',document.getElementById('img').files[0])

            axios({
                url:'http://127.0.0.1:8000/app01/fiction/',
                method:'post',
                data:fdata
            }).then(res=>{
                console.log(res.data)
            })
        }

    },
    created() {
        axios({
            url:'http://127.0.0.1:8000/app01/user/',
            method:'get'
        }).then(res=>{
            console.log(res.data)
            this.user_li = res.data
        })

    }
}
</script>

<style scoped>

</style>
